<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <title>Publisher :: Mediasoup Broadcast Example</title>
        <link rel="stylesheet" type="text/css" href="common.css" />
    </head>
    <body onload="publisherLoad()">
        <div class="container">
            <table class="params">
                <tr><th><label for="vid">Video:</label></th>
                    <td><select name="vid" id="vid">
                        <option value="">--None--</option>
                        <option value="env" selected="selected">Env Camera</option>
                        <option value="user">User Camera</option>
                        <option value="mjpeg">MJPEG URL</option>
                        <option value="tag">Video SRC</option>
                        </select>
                        <span id="res">0x0</span>, <span id="ivideokBps">0</span>kB/s
                    </td>
                </tr>
                <tr><th><label for="aud">Audio:</label></th>
                    <td><select name="aud" id="aud">
                        <option value="">--None--</option>
                        <option value="mic" selected="selected">Microphone</option>
                        <option value="tag">Video SRC</option>
                    </select>
                    <span id="iaudiokBps">0</span>kB/s</td>
                </tr>
                <tr>
                    <th><label for="tagUrl">Video SRC:</label></th>
                    <td><input type="text" value="videos/big_buck_bunny.mp4" id="tagUrl" /></td>
                </tr>
                <tr>
                    <th><label for="mjpegUrl">MJPEG URL:</label></th>
                    <td>
                        <input type="text" id="mjpegUrl" value="http://127.0.0.1:9000/mjpeg"/>
                    </td>
                </tr>
                <tr>
                    <th>Channel:</th>
                    <td><input type="text" value="test" id="pubChannel"/></td>
                </tr>
                <tr>
                    <th>Password:</th>
                    <td><input type="password" value="ChangeMe" id="pubPassword"/></td>
                </tr>
                <tr>
                    <td></td>
                    <td><button id="capture">Capture</button>
                        <button id="stopCapture">Stop Capturing</button>
                        <label for="publish"><input type="checkbox" id="publish"/>Publish</label></td>
                </tr>
            </table>
            <div class="videoContainer">
                <video id="pubVideo" autoplay playsinline></video>
            </div>
            <video id="bufVideo" autoplay playsinline></video>
            <canvas id="mjpegCanvas"></canvas>
        </div>
        <script type="text/javascript" src="mediasoup-client.js"></script> 
        <script type="text/javascript" src="publisher.js"></script>
        <script type="text/javascript" src="common.js"></script>
    </body>
</html>
